import React, { Component } from 'react';
import request from '../utils/request';
class Head extends Component {
    constructor(props) {
      super(props);
      this.state = {ajaxData: 123, item: []};
    }
    componentDidMount() {
        request.get('/get/alluser').then((res) => {
          this.setState(() => ({
              ajaxData: res.data.users
          }));
      })
    }
    render() {
      let data = this.state.ajaxData
      let usersElements = [];
      for(let i = 0; i< data.length;i++) {
            usersElements.push(
                <li key={data[i]._id}>
                    <p>{data[i].name}</p>
                    <p>{data[i].avatar_url}</p>
                    <p>
                        <img src={data[i].avatar_url} alt=""/>
                    </p>
                </li>
            )
      }

      return (
          <div className="">
              <h5>this is a details Page </h5>
              <div className="right">
                  {this.props.data}
                  <div>
                      <ul>
                          {usersElements}
                      </ul>
                  </div>
              </div>
          </div>
      );
    }
  }
  
  export default Head;
  